'use client'

import { useRouter } from 'next/navigation'

interface PaginationProps {
  currentPage: number
  totalPages: number
  hasNextPage: boolean
  hasPrevPage: boolean
}

export default function Pagination({ 
  currentPage, 
  totalPages, 
  hasNextPage, 
  hasPrevPage 
}: PaginationProps) {
  const router = useRouter()
  
  const handlePrevClick = () => {
    if (hasPrevPage) {
      router.push(`?page=${currentPage - 1}`)
    }
  }
  
  const handleNextClick = () => {
    if (hasNextPage) {
      router.push(`?page=${currentPage + 1}`)
    }
  }

  if (totalPages <= 1) return null

  return (
    <div className="flex justify-center space-x-4 pt-8">
      {hasPrevPage && (
        <button
          onClick={handlePrevClick}
          className="rounded bg-primary-500 px-2 py-0.5 h-9 text-white hover:bg-primary-600"
        >
          上一页
        </button>
      )}
      
      <span className="px-4 py-2 text-gray-500 dark:text-gray-400">
        {currentPage} / {totalPages}
      </span>
      
      {hasNextPage && (
        <button
          onClick={handleNextClick}
          className="rounded bg-primary-500 px-2 py-0.5 h-9 text-white hover:bg-primary-600"
        >
          下一页
        </button>
      )}
    </div>
  )
}